<html>
    <head>
        <?php $this->load->view('title'); ?>
        <link rel="shortcut icon" href="<?php echo base_url() ?>front-end/images/ac_logo.ico">
        <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
        <link rel="stylesheet" type="text/css" href="<?php echo base_url() ?>front-end/css/common.css">
        <link rel="stylesheet" type="text/css" href="<?php echo base_url() ?>front-end/css/building.css">
        <link rel="stylesheet" type="text/css" href="<?php echo base_url() ?>front-end/css/jquery.mCustomScrollbar.css">
        <script type="text/javascript" src="<?php echo base_url() ?>front-end/js/jquery.min.js"></script>
        <script type="text/javascript" src="<?php echo base_url() ?>front-end/js/jquery.mCustomScrollbar.concat.min.js"></script>
        <script>
            $(document).ready(function(){      
                var offset = <?php echo (empty($building_list) ? 0 : count($building_list)); ?>;
                var id = <?php echo $menu_item; ?>;   
                var isGetMore = false;
                var NoData = false;
                $(".Album").mCustomScrollbar({
                    autoDraggerLength: false,
                    scrollButtons:{
                        enable: true
                    },
                    advanced:{
                        updateOnContentResize: true
                    },
                    callbacks:{
                        whileScrolling: function(){
                            if ((mcs.topPct == 80) && (!isGetMore)){
                                var container = $(this).children().children();
                                if (NoData){
                                    
                                }else{
                                    $.ajax({
                                        type: 'post',
                                        url: '/building_controller/get__more_building',
                                        dataType: 'json',
                                        data:{
                                            'offset' : offset,
                                            'buildingID': id
                                        },
                                        beforeSend: function(){
                                            isGetMore = true;
                                            var html = '<li id="loading"><a href="#" alt="" class="Popup"><img style="width: 60%; border: none;" src="<?php echo base_url() ?>front-end/images/loading.gif"/></a></li>';
                                            container.append(html); 
                                        },
                                        success: function(data){
                                            isGetMore = false;
                                            $("#loading").remove();
                                            if (data.status == 'SUCCESS'){
                                                building_list = data.building_list;
                                                offset = data.offset;
                                                var html;
                                                for (i = 0; i < building_list.length; i++){
                                                    html = '<li>';
                                                    html += '<a href="<?php echo base_url($path) ?>'+building_list[i]['building_id']+'"title="'+building_list[i]['building_name']+'" class="Popup"><img src="<?php echo base_url() ?>' + building_list[i]['building_image'][0]['image_path']+'" alt="'+building_list[i]['building_name']+'"></a>';
                                                    html += '<a href="<?php echo base_url($path) ?>'+building_list[i]['building_id']+'" class="TitleAlbum"><span>'+building_list[i]['building_name']+'</span></a>';
                                                    html += '</li>';         
                                                    container.append(html); 
                                                }                             
                                            }else{
                                                NoData = true;
                                            }
                                        }
                                    });
                                }
                            }
                        }
                    }
                });
            });
        </script>
    </head>
    <body>
    	<div id="Container">
	        <?php $this->load->view('header'); ?>
	        <div id="MainContent">
	            <div id="BuildingContent">
	                <ul class="Album">
	                    <?php if (!empty($building_list)): ?>
	                        <?php foreach ($building_list as $building): ?>
	                            <li>
	                                <a href="<?php echo base_url($path . "/" . $building['building_id']) ?>" title="<?php echo $building['building_name'] ?>" class="Popup"><img src="<?php echo base_url() ?><?php echo (!empty($building['building_image'][0]['image_path']) ? $building['building_image'][0]['image_path'] : "") ?>" alt="<?php echo $building['building_name'] ?>"></a>
	                                <a href="<?php echo base_url($path . "/" . $building['building_id']) ?>" class="TitleAlbum" title="<?php echo $building['building_name'] ?>"><?php echo $building['building_name'] ?></a>
	                            </li>
	                        <?php endforeach; ?>
	                    <?php endif; ?>
	                </ul>
	            </div>
	        </div>
	        <?php $this->load->view('menu'); ?>
	        <?php $this->load->view('footer'); ?>
        </div>
    </body>
</html>
